import React, {Component} from 'react'
import {connect} from 'react-redux'
import {message} from 'antd'
import {searchUserByUsernameOrEmail, addTutorToProgram, queryProgramById} from '../../action/user'
import {Management} from '../common/management'
import {convertContent} from '../../constant/lang-util'
import {FormattedMessage} from 'react-intl'
import {removeTutorFromProgram} from "../../action/program";

class TotorManagement extends Component {

  state = {
    usernames: [],
    programId: -1,
    programName: "",
    isExistenceprogram: false,
    usernameOrEmail: [],
    isOperationProgramVisible: false,
    currentOpeningUserModalId: -1
  }

  handleSearchClick() {
    const type = "tutor"
    this.props.searchUserByUsernameOrEmail(this.state.usernames, type)
    this.setState({usernameOrEmail: this.state.usernames})
  }

  handleAddClick() {
    const userIds = this.props.programManagement.users.map((user) => (user.id));
    const {programId, isExistenceprogram} = this.state
    if (userIds.length === 0) {
      message.warning(convertContent("无效的用户"))
      return
    }
    if (programId < 1) {
      message.warning(convertContent("无效的Program"))
      return
    }
    if (!isExistenceprogram) {
      message.warning(convertContent("该特训营不存在"))
      return
    }
    this.props.addTutorToProgram(programId, userIds)
  }

  handleProgramIdChange(programId) {
    if (programId === "" || programId === undefined) {
      this.setState({programName: ""})
      this.setState({isExistenceprogram: false})
      return
    }
    this.setState({programId})
    this.props.queryProgramById(programId, (program) => {
      this.setState({isExistenceprogram: program.id ? true : false})
      this.setState({programName: program.id ? program.title : ''})
    });
  }

  handleUsernameChange(e) {
    let usernames = e.target.value
      .split("\n")
      .map(val => val.trim())
      .filter(val => val.length > 0)

    this.setState({usernames})
  }
  removeProgram(userId, programId) {
    this.props.removeTutorFromProgram(userId,programId)
    this.handleSearchClick()
  }

  render() {
    const title = <FormattedMessage id='助教端：添加助教到Program'/>
    const {programManagement} = this.props
    const {isOperationProgramVisible, usernameOrEmail, programName, currentOpeningUserModalId} = this.state

    return (
      <div>
        <Management
          title={title}
          handleSearchClick={this.handleSearchClick.bind(this)}
          handleAddClick={this.handleAddClick.bind(this)}
          handleProgramIdChange={this.handleProgramIdChange.bind(this)}
          handleUsernameChange={this.handleUsernameChange.bind(this)}
          programManagement={programManagement}
          usernameOrEmail={usernameOrEmail}
          programName={programName}

          isOperationProgramVisible={isOperationProgramVisible}
          openOperationProgramModal={(currentOpeningUserModalId)=>this.setState({isOperationProgramVisible: true, currentOpeningUserModalId})}
          closeOperationProgramModal={()=>this.setState({isOperationProgramVisible: false, currentOpeningUserModalId:-1})}
          removeProgram={this.removeProgram.bind(this)}
          currentOpeningUserModalId={currentOpeningUserModalId}
        />
      </div>
    )
  }
}

const mapStateToProps = state => ({
  programManagement: state.programManagement
})

const mapDispatchToProps = dispatch => ({
  searchUserByUsernameOrEmail: (usernames, type) => {
    dispatch(searchUserByUsernameOrEmail(usernames, type))
  },
  addTutorToProgram: (programId, userIds) => {
    dispatch(addTutorToProgram(programId, userIds))
  },
  queryProgramById: (programId, callback) => {
    dispatch(queryProgramById(programId, callback))
  },
  removeTutorFromProgram: (userId, programId) => {
    dispatch(removeTutorFromProgram(userId, programId))
  }
})

export default connect(mapStateToProps, mapDispatchToProps)(TotorManagement)